<template>
    <CommonModal
        v-model="state.visible"
        @handleOk="handleOk"
        @handleCancel="handleCancel"
        :title="state.modalTitle"
    >
        <a-form
            class="form_box"
            ref="formRef"
            name="custom-validation"
            :model="formState"
            :rules="rules"
            v-bind="layout"
        >
            <a-form-item has-feedback label="新密码" name="password" :colon="false">
                <!-- -password -->
                <a-input v-model:value="formState.password" autocomplete="off" placeholder="请输入新密码" />
            </a-form-item>
        </a-form>
        <div class="tips">密码要求6-16位，包含数字、大小写字母、符号四种元素</div>
    </CommonModal>
</template>
<script setup>
import {reactive, ref} from "vue";
// import {logicflowSync} from "@/service/api";
import { sysUserReset} from '@/service/api'
import {message} from "ant-design-vue";

const emit = defineEmits(['success'])
const formRef = ref()
const state = reactive({
    modalTitle: '',
    visible: false
})
let formState = reactive({
    // Zkzh@123
    password: 'Zkzh@123',
    id: ''
})
const validatePass = async (_rule, password) =>{
    if (password === '') {
        return Promise.reject('请输入密码');
    }
    if (password.length < 6 || password.length > 16) {
        return Promise.reject('密码长度必须在6到16位之间');
    }
    // 判断是否包含小写字母
    if (!/[a-z]/.test(password)) {
        return Promise.reject('密码必须包含至少一个小写字母');
    }
    // 判断是否包含大写字母
    if (!/[A-Z]/.test(password)) {
        return Promise.reject('密码必须包含至少一个大写字母');
    }
    // 判断是否包含数字
    if (!/\d/.test(password)) {
        return Promise.reject('密码必须包含至少一个数字');
    }
    // 判断是否包含符号
    if (!/[^\da-zA-Z]/.test(password)) {
        return Promise.reject('密码必须包含至少一个符号');
    }
    return Promise.resolve();
}
const rules = {
    password: [{required: true,trigger: 'change',validator: validatePass}],
};

const layout = {
    labelCol: {
        span: 4
    },
    wrapperCol: {
        span: 12,
    },
};
// 确认
const handleOk = () => {
    formRef.value.validateFields().then(r=>{
        let params = {
            ...formState
        }
        sysUserReset({
            id:formState.id,
            password:formState.password,
        }).then(res => {
            if (res.status == "000_0000_0000") {
                message.success('修改密码成功');
                handleCancel()
                // emit('success')
            }
        })
        // userResetPwd(params).then(res=>{
        //     console.log(res,'重置密码')
        //     if(res.status ==='000_0000_0000') {
        //         message.success('重置成功');
        //         handleCancel()
        //         emit('success')
        //     }
        // })

    }).catch(err=>{

    })
}
// 取消
const handleCancel = () => {
    formRef.value.resetFields()
    state.visible = false
    formState.id = ''
}
const showModal = (obj) => {
    state.modalTitle = obj.title
    state.visible = true
    formState.id = obj.id;
    // formState.password = obj.password;
    // console.log(obj,'obj');
}
defineExpose({showModal})
</script>
<style scoped lang="less">
.form_box{
    input,:deep(.JManage-select-selector){
        width: 200px;
        height: 32px;
        box-sizing: border-box;
        background: #FFFFFF;
        border-radius: 6px;
        border: 1px solid #E0E0E0;
    }
    :deep(.JManage-select-show-arrow){
        width: 200px;
    }
    .JManage-radio-group{
        width: 250px;
    }
    :deep(.JManage-form-item-control-input .JManage-form-item-control-input-content){
        width: 100%;
    }
    textarea{
        height: 64px;
        border-radius: 6px;
        border: 1px solid #E0E0E0;
    }
}
.tips{
    width: 392px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    margin: 24px auto 0;
    font-size: 14px;
    background: #F5F5F5;
    color: #999999;
    border-radius: 4px;
}
</style>
